<template>
	<view class="container">
		<div class="content">
			<view class="img-single" v-if="item.photo">
				<view class="img-wrapper img-wrapper-single">
					<image class="img" :src="weburl + item.photo"></image>
				</view>
			</view>
			<view class="item border-b-line itembbb">
				<view class="text-bold    ">{{ item.title }}</view>
			</view>
			<view class="border-b-line" v-if="item.content">
				<view class="  ">
					<view class="shoptitle">
						<text>商品详情</text>
					</view>
				</view>
			</view>
			<view class="flex flex-wrap text-content text-df padding-sm">
				<u-parse :content="item.content" @preview="preview" @navigate="navigate" :imageProp="imageProp"></u-parse>
			</view>
			<view class="bottom-height"></view>
			<view class="fixed bottom shadow-warp box">
				<view class="cu-bar bg-white tabbar border shop">
					<view class="grid total-box">
						<view class="padding-sm flex-twice">
							<numberBox class="step" :min="minnum" :max="maxnum" :value="minnum"></numberBox>
						</view>
						<view class="padding-sm text-right">
							<view class="block text-gray text-sm">{{this.item.buy_type == 1 ? '使用积分兑换' : '使用现金购买'}}</view>
							<view class="block text-price cococo">{{ item.price }}{{this.item.buy_type == 1 ? '积分' : '元'}}</view>
						</view>
					</view>
					<view class="bg-blue submit" @click="navToCart()">立即兑换</view>
				</view>
			</view>
		</div>
	</view>
</template>
<script>
	import numberBox from '@/components/uni-number-box/uni-number-box.vue';
	import uParse from '@/components/u-parse/u-parse.vue';
	export default {
		components: {
			numberBox,
			uParse
		},
        data() {
            return {
				minnum:1,
				maxnum:1,
				modalName: null,
				code: "",
				beginTips:"",
				item: {},
				isloaded: !1,
				isLoading: !1,
				imageProp:{}
            }
        },
		onLoad: function (option) {
			this.code = option.code;
			this.imageProp = {'mode':'aspectFit','domain':this.weburl};
            this.loadData();
		},
		methods: {
			loadData: function() {
				
				let timestamp = this.helper.now();
				let sign = this.helper.setSign(['code='+this.code,'timestamp='+timestamp]);
				this.helper.req({
					api:"getGoodsDetail",
					timestamp:timestamp,
					data:{code:this.code},
					header:{sign:sign},
					method:'GET',
				}).then(res=>{
					this.item = res.data.data.item;
				})
			},
            navToCart: function() {
				uni.navigateTo({
					url: "/pages/goods/cart?code=" + this.code + "&buy_type=" + this.item.buy_type
				})
            },
			preview(src, e) {
				// do something
			},
			navigate(href, e) {
				// do something
			}
		}
    }
</script>

<style lang="scss">
	page{
		background: #f3f8ff;
	}
	.wxParse{
		width: 100%;
	}
	.cococo{
		color: #c0a260;
	}
	.cu-bar.tabbar .submit{
		border-radius: 20rpx 0 0 20rpx;
		 background: linear-gradient(to bottom, #eedfb4, #c0a260);
		 width: 100rpx;
	}
	.cu-bar.tabbar .submit:last-child{
		-webkit-box-flex: 1.6;
		-webkit-flex: 1.6;
		flex: 1.6;
	}
	.img-single {
		width: 100%;
		height: 650rpx;
		margin: 0upx 0upx
	}
	.shoptitle{
		 text-align: center;
		 border-bottom: 1px solid rgba(0, 0, 0, .1);
		 padding: 30rpx 0;
		 text{
			 color: #353535;
		 }
	}
	.itembbb{
		background: #f3f8ff;
		padding:15rpx;
	}
	.img-wrapper {
		-webkit-box-flex: 1;
		-webkit-flex: 1;
		flex: 1;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-webkit-flex-direction: row;
		flex-direction: row;
		height: 100%;
		width: 100%;
		position: relative;
		overflow: hidden
	}
	.img {
		-webkit-box-flex: 1;
		-webkit-flex: 1;
		flex: 1;
		z-index: 9;
		opacity: 1;
		width: 100%;
		height: 100%;
	}
	.cu-bar.tabbar{
		width: 100%;
	}
	.fixed {
		position: fixed;
		z-index: 99;
	}
	.box {
		width: 100%;
		bottom: 0
	}
	.bottom-height {
		margin-bottom: 120upx;
		height: inherit
	}
</style>